// 向elem1添加elem2孩子节点
function addChild(elem1, elem2) {
    elem1.appendChild(elem2);
}

// 向elem1添加elem2孩子节点，elem2可能为多个孩子节点集合
function addChilds(elem1, elem2) {
    elem2.forEach(function (elem) {
        addChild(elem1, elem);
    })
}

// 用class = "xxxx-xxxx" 形式的属性名生成驼峰命名
function toCamelCase(className) {
    let reg = /-+(\w)/g;
    return className.replace(reg, function ($0, $1) {
        return $1.toUpperCase();
    });
}

/*
  创建节点
  nodeType: 节点类型
  attrsList: 节点属性列表
 */
function createNode(nodeType, attrsMap) {
    // 创建node节点
    let node = document.createElement(nodeType);
    // for in 遍历json数据，遍历的是key
    // 为node节点添加属性
    for (let attr in attrsMap) {
        node[attr] = attrsMap[attr];
    }
    return node;
}

/*
  创建多个节点
 */
function createNodes(classNameList, nodeType = "div") {
    mapObj = new Map();
    classNameList.forEach(function (className) {
        mapObj.set(toCamelCase(className), createNode(nodeType, {'className': className, 'id': className}));
    })
    return mapObj;
}

// 生成子节点
function newChildNode(parentId, mineId) {
    let parentNode = document.getElementById(parentId);
    let node = createNode("div", {"id": mineId});
    addChild(parentNode, node);
}

// 生成子节点文本节点
function newTextChildNode(id) {
    let parentNode = document.getElementById(id);
    let node = createNode("p", {"id": id + "-text", "className": "text-content"});
    addChild(parentNode, node);
}

function newTextChildNodeWithClassName(id, className) {
    let parentNode = document.getElementById(id);
    let node = createNode("p", {"id": id + "-text", "className": "text-content " + className});
    addChild(parentNode, node);
}

// 添加文本内容
function fillText(nodeId, text) {
    let node = document.getElementById(nodeId);
    node.innerText = text;
}

// 节点添加class名
function addClassName(nodeIdList, className) {
    nodeIdList.forEach(function (nodeId) {
        document.getElementById(nodeId).classList.add(className);
    })
}

function setNumImage(nodeId, value, color = "") {
    if (color == "") {
        document.getElementById(nodeId).style.backgroundImage = "url(../assets/img/" + value + ".svg)";
    } else {
        document.getElementById(nodeId).style.backgroundImage = "url(../assets/img/" + value + "_" + color + ".svg)";
    }

}